import React from 'react';
import { Grid, Image } from 'antd-mobile';
import "./ChatMessage.scss"
const ChatMessage = () => {
  return (
    <div className="chat-message">
      {/*患者卡片*/}
      <div className="msg msg-illness">
        <div className="patient">
          <p>李富贵 男 31岁</p>
          <p>一周内 | 未去医院就诊</p>
        </div>
        <Grid columns={3}>
          <Grid.Item>病情描述</Grid.Item>
          <Grid.Item>头痛、头晕、恶心</Grid.Item>
        </Grid>
        <Grid columns={3}>
          <Grid.Item>图片</Grid.Item>
          <Grid.Item>点击查看</Grid.Item>
        </Grid>
      </div>
      {/*通知-通用*/}
      <div className="msg msg-tip">
        <div className="content">
          <span>医护人员正在赶来，请耐心等候</span>
        </div>
      </div>
      {/*通知-温馨提示*/}
      <div className="msg msg-tip">
        <div className="content">
          <span className="green">温馨提示：</span>
          <span>在线咨询不能代替面诊，医护人员建议仅供参考</span>
        </div>
      </div>
      {/*通知-结束*/}
      <div className="msg msg-tip msg-tip-cancel">
        <div className="content">
          <span>订单取消</span>
        </div>
      </div>
      {/*发送文字*/}
      <div className="msg msg-to">
        <div className="content">
          <div className="time">20:12</div>
          <div className="pao">大夫你好？</div>
        </div>
        <Image src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
      </div>
      {/*发送图片*/}
      <div className="msg msg-to">
        <div className="content">
          <div className="time">20:12</div>
          <Image fit="contain" src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
        </div>
        <Image src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
      </div>
      {/*接收文字*/}
      <div className="msg msg-from">
        <Image src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
        <div className="content">
          <div className="time">20:12</div>
          <div className="pao">哪里不舒服</div>
        </div>
      </div>
      {/*接收图片*/}
      <div className="msg msg-from">
        <Image src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
        <div className="content">
          <div className="time">20:12</div>
          <Image fit="contain" src="https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/popular_3.jpg" />
        </div>
      </div>
      {/*处方卡片*/}
      <div className="msg msg-recipe">
        <div className="content">
          <div className="head van-hairline--bottom">
            <div className="head-tit">
              <h3>电子处方</h3>
              <p>原始处方</p>
            </div>
            <p>李富贵 男 31岁 血管性头痛</p>
            <p>开方时间：2022-01-15 14:21:42</p>
          </div>
          <div className="body">
            <div className="body-item">
              <div className="durg">
                <p>优赛明 维生素E乳</p>
                <p>口服，每次1袋，每天3次，用药3天</p>
              </div>
              <div className="num">x1</div>
            </div>
          </div>
          <div className="foot"><span>购买药品</span></div>
        </div>

      </div>
      {/*评价卡片*/}
    </div>
  );
};

export default ChatMessage;